<template>
  <div>
    <b @click="me" class="tubiao"><i class="el-icon-arrow-left"></i></b>
    <div class="shop">
      <i class="dingdan">订单号：2019090112456</i>
      <div class="left">
        <img
          src="https://img.wxcha.com/m00/99/7a/3cb6fa656a4cfcb3406f12ee68efa8e2.jpg?down"
          alt=""
        />
      </div>
      <div class="right">
        <p>黄色连衣裙，纯棉设计，洋气大方，韩版流行休闲网纱....</p>
        <span>￥100.0</span><br />
      </div>
    </div>
  <div class="h4">
    <h4>拼团中</h4>
    </div>
                        <!-- 拼团失效时间 -->
    <div class="center">
         <div class="shop">
      <div class="left">
        <img
          src="https://img.wxcha.com/m00/99/7a/3cb6fa656a4cfcb3406f12ee68efa8e2.jpg?down"
          alt=""
        />
      </div>
      <div class="right">
        <p>黄色连衣裙，纯棉设计，洋气大方，韩版流行休闲网纱....</p>
        <span>￥100.0</span><br />
      </div>
    </div>
    </div>

    <div class="button">邀请好友</div>
  </div>
</template>

<script>
export default {

    methods:{
        me() {
      this.$router.push("/collage");
    },
    }
};
</script>

<style scoped>
.tubiao{
    position: absolute;
    top: 3vh;
    left: 4vw;
    font-weight: bold;
    color: #409EFF;
    font-size: 24px;
}

.h4{
    
    border-bottom: 1px solid #e1e1e1;
}
h4{
    margin-top: 8vh;
    margin-left: 41vw;
    font-weight: normal;
    padding: 5px;
}
.center .shop p{
    font-size: 12px;
}
.center .shop{
     width: 64vw;
  margin-top: 5vh;
  display: flex;
  justify-content: space-evenly;
  position: relative;
  /* margin: 0 auto; */
  margin-left: 17vw;
}
.center .shop img{
    width: 90%;
}
.center {
  text-align: center;
}

.dingdan {
  position: absolute;
  font-size: 12px;
  top: -3vh;
  left: 10vw;
}
.button {
  width: 70vw;
  height: 6vh;
  background: #409EFF;
  text-align: center;
  border-radius: 10px;
  line-height: 6vh;
  color: white;
  margin-top: 2vh;
  position: absolute;
    bottom: 1vh;
    left: 15vw;
}
.shop {
  width: 100vw;
  margin-top: 5vh;
  display: flex;
  justify-content: space-evenly;
  position: relative;
}
.right p {
  font-size: 14px;
}
.right {
  height: 14vh;
  width: 50vw;
}
.right span {
  color: red;
  font-size: 14px;
}
.left {
  width: 30vw;
  height: 14vh;
}
.left img {
  width: 100%;
  border-radius: 20px;
}
</style>